<script src="./orderdetails.js"></script>
<style lang="less" scoped src="../../public.less"></style>
<template>
    <div>
        <!--<Modal v-model="chargeDetailVisable"-->
               <!--title="培训缴费"-->
               <!--width="90%"-->
               <!--:mask-closable="false">-->
        <div>
            <h3>学生信息</h3>
            <Row class="table-Row">
                <Col span="3" class="table-row-title">姓名：</Col>
                <Col span="3" class="table-row-content">{{orderDetails.name}}</Col>
                <Col span="3" class="table-row-title">性别：</Col>
                <Col span="3" class="table-row-content">{{orderDetails.sex}}</Col>
                <Col span="3" class="table-row-title">出生日期：</Col>
                <Col span="3" class="table-row-content">{{orderDetails.birthdate}}</Col>
                <Col span="3" class="table-row-title">身份证号：</Col>
                <Col span="3" class="table-row-content">{{orderDetails.cardcode}}</Col>
            </Row>
            <Row class="table-Row">
                <Col span="3" class="table-row-title">家长姓名：</Col>
                <Col span="3" class="table-row-content">{{orderDetails.parentname}}</Col>
                <Col span="3" class="table-row-title">家长手机：</Col>
                <Col span="3" class="table-row-content">{{orderDetails.parentphone}}</Col>
                <Col span="3" class="table-row-title">是否新生：</Col>
                <Col span="3" class="table-row-content"></Col>
            </Row>
            <h3>班级信息</h3>
            <Table border :columns="class_columns" :data="class_dataList"></Table>
            <h3>收费信息</h3>
            <Table border :columns="charge_columns_1" :data="charge_dataList"></Table>
            <div style="margin-top:20px;display: flex;">
                <h1>收费合计:<span style="color: red">{{orderDetails.amt}}</span></h1>
                <h1 style="margin-left: 20px">自动打折金额:<span style="color: red">0</span></h1>
                <h1 style="margin-left: 20px">打折金额:<span style="color: red">{{orderDetails.discount_amt}}</span></h1>
                <h1 style="margin-left:20px"> 应收合计:<span style="color: red">{{orderDetails.real_amt}}</span></h1>
            </div>
            <div style="text-align: center">
                <div>
                    支付方式：
                    <!--<Select style="width: 150px;" v-model="payType">-->
                        <!--<Option value=''>请选择</Option>-->
                        <!--<Option value='1'>现金</Option>-->
                        <!--<Option value='2'>余额支付</Option>-->
                        <!--<Option value='14'>微信条码支付</Option>-->
                    <!--</Select>-->
                    <Select v-model="payType" style="width: 150px;">
                        <Option value=''>请选择</Option>
                        <Option v-for="item in payTypeList" :value="item.value" :key="item.id">{{item.name}}
                        </Option>
                    </Select>
                </div>
                <div style="margin-top: 10px;">
                    <Button type="success" @click="showChargeDiscount">打折</Button>
                    <Button type="success"  @click="doPay" :loading="paying">缴费</Button>
                </div>
                <div style="margin-top: 10px;">
                    <Button type="primary" @click="">返回</Button>
                </div>
            </div>
        </div>
        <!--</Modal>-->

        <Modal v-model="chargeDiscountVisable"
               title="打折"
               width="50%"
               :transfer="false"
               :mask-closable="false"
               @on-ok="doDiscount">
            <h3>打折信息</h3>
            <div style="margin-top: 15px;">
                打折理由:&nbsp;<Select style="width:150px" @on-change="whenSelectDiscountType"  :label-in-value="true">
                <Option v-for="item in discountTypeList" :value="item.discountRate" :key="item.id">{{ item.name }}</Option>
            </Select>&nbsp;&nbsp;
                折扣率:&nbsp;&nbsp;<Input style="width: 30%;" @on-blur="countDiscount" v-model="discountRate"/>&nbsp;&nbsp;%
            </div>
            <div style="margin-top: 15px;">
                <Table border :columns="charge_columns_2" :data="charge_dataList"></Table>
            </div>
        </Modal>


        <Modal v-model="payNumVisible"
               title="支付中心条码支付"
               width="300px"
               :transfer="false"
               :mask-closable="false"
               ok-text="支付"
               @on-ok="payByWechat"
        >
            <div style="text-align: center">
                <h3>使用扫码枪扫描用户出示的支付条码</h3>
                <h3 style="color: red;">注意：扫码前请确保光标在输入框内</h3>
                <Input v-model="payNum" clearable style="width: 200px;margin-top: 20px;"></Input>
            </div>
        </Modal>
    </div>
</template>
